<div class="f-nav-detail">
	<detail-nav></detail-nav>
</div>
<div class="wrap">
	<div class="banner"><img src="{{bannerSrc}}" alt=""/><p ng-bind="title"></p></div>
	<div class="title"><span ng-bind="category.catalogName"></span></div>
	<div class="content">
		<div class="content-title">
			<div class="left">
				<img src="./them/img/zhutipic.png" alt=""/><span>白问百答</span>
			</div>
			<div class="right">
				<ul>
					<li ng-class="{'active':questionType=='all'}" ng-click="all()">全部问题</li>
					<li ng-class="{'active':questionType=='solved'}" ng-click="solved()">已解决</li>
					<li ng-class="{'active':questionType=='solve'}" ng-click="solve()">待解决</li>
				</ul>
				<p ng-click="gotoiask()">我要提问</p>
			</div>
		</div>
		<ul class="content-container">
			<li>
				<p class="left">标题</p>
				<ul class="right">
					<li>回复</li>
					<li>状态</li>
					<li>悬赏（积分）</li>
					<li>提问时间</li>
				</ul>
			</li>
			<li ng-repeat="item in dataList track by $index" ng-class="{'grey':$even,'white':$odd}">
				<div class="question-info">
					<div class="left"><p ng-bind="item.title" ui-sref="eng.postbardeta({postbarId:item.postbarId})"></p><span ng-click="openEdit(item)">{{item.html}}</span></div>
					<ul class="right">
						<li ng-bind="item.replyCount"></li>
						<li><span class="green" ng-class="{'green':item.solve==2,'red':item.solve==1}">{{item.solveHtml}}</span></li>
						<li ng-bind="item.price"></li>
						<li>{{item.time|dateFilter2}}</li>
					</ul>
				</div>
				<div class="edit" ng-if="item.flag">
					<div ui-editor  class="editBox" id="editorbox" set-model="$parent.$parent.editorContent"  editor-type="'tiny'" ng-if="item.flag"></div>
					<div class="edit-bg"></div>
					<div class="edit-OK" ng-click="submitAnswer(item.postbarId,item.userId)"><span>提交回答</span></div>
				</div>
			</li>
			<li class="nullBg" ng-if="nullBgFlag"></li>
		</ul>
		<div class="page-index">
			<ui-pagination ng-if="paginationConf" conf="paginationConf"></ui-pagination>
		</div>
	</div>
</div>
<div ng-include="'app/business/common/footer.html'"></div>
<div class="tipBox" ng-if="createQuestionFlag">
	<p>您尚未登录。请<span ui-sref="login">登录</span>后提问</br>
		如还没有注册，请点击<span ui-sref="login({type:'register'})">注册</span>
	</p>
	<span ng-click="closeTipBox('createQuestion')"></span>
</div>
<div class="tipBox" ng-if="answerFlag">
	<p>您尚未登录。请<span ui-sref="login">登录</span>后回答</br>
		如还没有注册，请点击<span ui-sref="login({type:'register'})">注册</span>
	</p>
	<span ng-click="closeTipBox('answer')"></span>
</div>
	<style>
		.tipBox>span{
			display: block;
			position: absolute;
			right:19px;
			top:19px;
			width:10px;
			height:10px;
			background:url("them/img/xxx.png") 0px 0px no-repeat;
			cursor: pointer;
		}
		.tipBox{
			position: fixed;
			left:0;
			top:0;
			right:0;
			bottom: 0;
			margin:auto;
			width:318px;
			height:152px;
			border:1px solid #30a3ff;
			background:white;
			color:##666;
			font-size:14px;
			display: flex;
			justify-content: center;
			align-items: center;
		}
		.tipBox p{
			line-height:30px;
		}
		.tipBox p span{
			color:#30a3ff;
			cursor: pointer;
		}
		.nullBg{
			width:100%;
			height:500px;
			background: #fff url(them/imag/no-eng.png) no-repeat center 135px;
		}
		.active{
			color:#30a3ff;
		}
		.page-index{
			height:71px;
		}
		.page-index>div{
			display: flex;
			justify-content: center;
		}
		.page-index>div .pagination{
			margin-left: 0;
		}
		*{
			box-sizing: border-box;
		}
		body{
			background: url("them/img/jb-bg.png") 0px 0px repeat;
			background-size: 600px 600px;
		}
		.wrap{
			width:1200px;
			margin:0 auto;
			margin-bottom:50px;
		}
		.banner{
			padding:10px 0;
			position: relative;
		}
		.banner p{
			color:white;
			font-size:30px;
			font-weight: bold;
			position: absolute;
			top:0;
			left:0;
			line-height:120px;
			padding-left:20px;
			text-shadow:5px 5px 15px rgba(0,0,0,.7);
		}
		.title{
			width:100%;
			height:60px;
			background:white;
			border-top:2px solid #ff6638;
			line-height:60px;
			margin:5px 0 10px 0;
		}
		.title span{
			color:#333333;
			font-size:20px;
			font-weight:bold;
			padding-left:20px;
		}
		.content{
			width:100%;
			padding:20px 20px 0 20px;
			background:white;
		}
		.content-title{
			line-height:22px;
			display: flex;
			justify-content: space-between;
			align-items: center;
			padding-bottom:20px;
		}
		.content-title .left img{
			vertical-align:middle;
		}
		.content-title .left span{
			color:#000000;
			font-size:18px;
			font-weight: bold;
			vertical-align:middle;
			padding-left:10px;
		}
		.content-title .right{
			font-size:14px;
		}
		.content-title .right>ul>li{
			padding:0 20px;
			height:16px;
			line-height:16px;
			cursor: pointer;
		}
		.content-title .right>ul>li:nth-child(2){
			border-left:1px solid #dddddd;
			border-right:1px solid #dddddd;
		}
		.content-title .right>ul,.content-title .right,.content-container>li ul,.content-container .left{
			display: flex;
			justify-content: space-between;
			align-items: center;
		}
		.content-title .right p{
			margin-left:30px;
			width:90px;
			height:30px;
			background:#30a3ff;
			color:white;
			line-height: 30px;
			text-align: center;
			cursor: pointer;
		}
		.content-container{
			font-size:14px;
		}
		.content-container>li.grey{
			background:#f5f5f5;
		}
		.content-container>li.white{
			background:white;
		}
		.content-container>li .edit{
			padding:20px 40px 20px 30px;
			position: relative;
		}
		.content-container>li .edit .edit-bg{
			width:1090px;
			height:208px;
			background: #ebebeb;
			border:1px solid #ddd;
			position: absolute;
			top:23px;
			left:33px;
		}
		.content-container>li .edit-OK{
			text-align: right;
			margin-top:15px;
		}
		.content-container>li .edit-OK>span{
			display: inline-block;
			width:80px;
			height:30px;
			background: #30a3ff;
			line-height:30px;
			text-align: center;
			color:white;
			cursor: pointer;
		}
		.content-container>li .editBox{
			height:200px;
		}
		.content-container .question-info{
			height:44px;
			display: flex;
			justify-content: space-between;
			align-items:center;
		}
		.content-container>li:nth-child(1){
			height:34px;
			background:#f0f6fc;
			margin-bottom:15px;
			display: flex;
			justify-content: space-between;
			align-items:center;
			padding-left:15px;
		}
		.content-container .left p{
			padding-left:15px;
			width:600px;
			cursor: pointer;
		}
		.content-container .left p:hover{
			color:#30a3ff;
			text-decoration: underline;
		}
		.content-container .left span{
			display: inline-block;
			width:64px;
			height:24px;
			text-align: center;
			line-height:22px;
			color:#30a3ff;
			border:1px solid #30a3ff;
			border-radius:12px;
			opacity:0;
			cursor: pointer;
		}
		.content-container li:hover .left span{
			opacity:1;
		}
		.content-container .right{
			margin-right:20px;
		}
		.content-container .right li{
			padding:0 15px;
			text-align: center;
		}
		.content-container .right li:nth-child(1){
			width:64px;
		}
		.content-container .right li:nth-child(2){
			width:80px;
		}
		.content-container .right li:nth-child(3){
			width:120px;
		}
		.content-container .right li:nth-child(4){
			width:92px;
		}
		.content-container .right span{
			display: inline-block;
			width:50px;
			height:24px;
			text-align: center;
			line-height:22px;
			background:white;
			border-radius:12px;
		}
		.content-container .right span.green{
			color:#13ab2d;
			border:1px solid #13ab2d;
		}
		.content-container .right span.red{
			color:#ff0000;
			border:1px solid #ff0000;
		}
	</style>